<script setup lang="ts">
import { ref, onMounted } from "vue"
import { getMessageture } from "@/api/message.ts";
import {title,leftBack,rightSearch} from '@/router/index.ts'


//　判断消息页是否有消息
const message = ref(false)
const getMessage = async () => {
  const res= await getMessageture()
  message.value = res.data.data
}

onMounted(() => getMessage())
</script>

<template>
<!--  NavBar标签-->
  <van-sticky>
    <van-nav-bar :title="title" @click-left="$router.back()" @click-right="$router.push('/search')">
      <template #right v-if="rightSearch">
        <van-icon name="search" size="18" />
      </template>
      <template #left v-if="leftBack">
        <van-icon name="arrow-left" size="18" />
      </template>
    </van-nav-bar>
  </van-sticky>
  <div class="contain">
    <router-view></router-view>
  </div>
  <!--  Tabbar标签-->
  <van-tabbar :border="false" route >
    <van-tabbar-item to="/home" icon="home-o">主页</van-tabbar-item>
    <van-tabbar-item to='/team' icon="flag-o" >队伍</van-tabbar-item>
    <van-tabbar-item to='/blog/add' icon="add-square" >发布</van-tabbar-item>
    <van-tabbar-item to='/message' icon="chat-o" :dot="message">消息</van-tabbar-item>
    <van-tabbar-item to='/user' icon="manager-o" >我的</van-tabbar-item>
  </van-tabbar>

</template>

<style scoped>
.contain{
  padding: 2px;
  padding-bottom: 50px;
}
</style>